// 实现这个项目的构建任务自动化构建
const { src, dest,parallel,series } = require('gulp')
const gulpLoadPlugins = require('gulp-load-plugins')
const browserSync = require('browser-sync')
const bs = browserSync.create()
const del = require('del')
const plugins = gulpLoadPlugins() //引入plugins以后不需要挨个引入gulp下的插件
// 自动化构建 首先要将js css html打包
const data={
    menus: [
        {
          name: 'Home',
          icon: 'aperture',
          link: 'index.html'
        },
        {
          name: 'Features',
          link: 'features.html'
        },
        {
          name: 'About',
          link: 'about.html'
        },
        {
          name: 'Contact',
          link: '#',
          children: [
            {
              name: 'Twitter',
              link: 'https://twitter.com/w_zce'
            },
            {
              name: 'About',
              link: 'https://weibo.com/zceme'
            },
            {
              name: 'divider'
            },
            {
              name: 'About',
              link: 'https://github.com/zce'
            }
          ]
        }
      ],
      pkg: require('./package.json'),
      date: new Date()
}
const style = () => {
    return src('src/assets/styles/*.scss', { base: 'src' }) 
      .pipe(plugins.sass({ outputStyle: 'expanded' }))
      .pipe(dest('temp'))
  }
const js = ()=>{
    return src ('src/assets/scripts/*.js',{ base:'src' })
    .pipe(plugins.babel({presets:['@babel/preset-env']}))
    .pipe(dest('dist'))
   }

 const page = () => {//编译模版文件
    return src('src/**/*.html',{ base : 'src'})
    .pipe(plugins.swig({data}))
    .pipe(dest('dist'))
}

 //图片文件转换
  const image = () => {
      return src('src/assets/images/**',{ base :'src'}).pipe(plugins.imagemin()).pipe(dest('dist'))
  }
//   字体
  const font = () => {
    return src('src/assets/fonts/**',{ base :'src'}).pipe(plugins.fontmin()).pipe(dest('dist'))
}
  const other =()=>{
      return src('src/public/**',{ base:'src' }).pipe(dest('dist'))
  }
  const clean = () => {
      return del(['dist'])
  }
  const serve = () => {
      bs.init({
          notify:false,
          debugInfo:false,
          serve:{
              baseDir:"dist",
              routes:{
                  '/node_modules':'node_modules'
              }
          }
      })
  }
const compile = parallel(style,js,page)
const build = series(clean,compile,  image,
    font,
    other)
const dev = series(compile,serve)

module.exports ={build,dev}